// 项目清算管理-生成清算
<template>
  <div class="generatingLiquidation">
    <el-breadcrumb separator="/" class="bread-title">
      <el-breadcrumb-item :to="{ path: '/projectLiquidationManagement' }">项目清算管理</el-breadcrumb-item>
      <el-breadcrumb-item>生成清算</el-breadcrumb-item>
    </el-breadcrumb>
    <div class="part">
      <div class="title">项目运营分析</div>
      <el-form label-width="80px" v-show="!this.reGenerate" :rules="rules" ref="formData" :model="formData">
        <el-form-item label="项目：" label-width="120px">
          <el-select v-model="value" placeholder="请选择跟投项目" @change="changeValue(value)">
            <el-option v-for="item in projectList" :label="item.projectName" :key="item.id" :value="item.id"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="项目营收：" label-width="120px">
          <el-input v-model="formData.investTotalMoney" disabled></el-input>元
        </el-form-item>
        <el-form-item label="项目利润率：" label-width="120px"  prop="projecteProfitMargin">
          <el-input v-model="formData.projecteProfitMargin"></el-input>%
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="onSubmit">生成</el-button>
        </el-form-item>
      </el-form>
      <el-form label-width="80px" v-show="this.reGenerate">
        <el-form-item label="项目：" label-width="120px">
          <el-select v-model="formData.projectName" disabled>
          </el-select>
        </el-form-item>
        <el-form-item label="项目营收：" label-width="120px">
          <el-input v-model="formData.investTotalMoney" disabled></el-input>元
        </el-form-item>
        <el-form-item label="项目利润率：" label-width="120px">
          <el-input v-model="formData.projecteProfitMargin"></el-input>%
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="onSubmit">生成</el-button>
        </el-form-item>
      </el-form>
    </div>
    <div class="line"></div>
    <div class="part">
      <div class="title">跟投主体项目清算明细信息</div>
      <template>
        <el-table
          border
          height="250"
          :data="mainpartList"
          stripe
          style="width: 100%">
          <el-table-column
            align="center"
            type="index"
            fixed
            label="序号"
            width="80">
          </el-table-column>
          <el-table-column
            align="center"
            prop="mainpartName"
            label="公司/个人名称"
            width="180">
          </el-table-column>
          <el-table-column
            align="center"
            prop="mainpartInvest"
            label="跟投主体">
            <template slot-scope='scope'>
              <span v-show="scope.row.mainpartInvest == 0">内部法人</span>
              <span v-show="scope.row.mainpartInvest == 1">渠道/经纪</span>
              <span v-show="scope.row.mainpartInvest == 2">开发商</span>
              <span v-show="scope.row.mainpartInvest == 3">内部员工</span>
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            width="180"
            prop="proportion"
            label="比例">
            <template slot-scope='scope'>
              {{scope.row.proportion}}%
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            width="180"
            prop="quota"
            label="跟投额度（元）">
            <template slot-scope='scope'>
              {{scope.row.quota | numFilter}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            width="180"
            prop="amountBonus"
            label="分红金额（元）">
            <template slot-scope='scope'>
              {{scope.row.amountBonus | numFilter}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            width="180"
            prop="sumAmount"
            label="结算总额（元）">
            <template slot-scope='scope'>
              {{scope.row.sumAmount | numFilter}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            width="180"
            prop="profit"
            label="收益率">
            <template slot-scope='scope'>
              {{scope.row.profit}}%
            </template>
          </el-table-column>
        </el-table>
      </template>
    </div>
    <div class="part">
      <div class="title">内部员工项目清算明细信息</div>
      <template>
        <el-table
          border
          height="250"
          :data="staffList"
          stripe
          style="width: 100%">
          <el-table-column
            align="center"
            type="index"
            fixed
            label="序号"
            width="80">
          </el-table-column>
          <el-table-column
            align="center"
            prop="orderNumber"
            label="订单号"
            width="220">
          </el-table-column>
          <el-table-column
            align="center"
            prop="userName"
            label="员工"
            width="180">
          </el-table-column>
          <el-table-column
            align="center"
            width="180"
            prop="jobNumber"
            label="工号">
          </el-table-column>
          <el-table-column
            align="center"
            width="180"
            prop="department"
            label="部门">
          </el-table-column>
          <el-table-column
            align="center"
            width="180"
            prop="position"
            label="职位">
          </el-table-column>
          <el-table-column
            align="center"
            width="180"
            prop="quota"
            label="实付金额（元）">
            <template slot-scope="scope">
              {{scope.row.quota | numFilter}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            width="180"
            prop="number"
            label="跟投份数">
            <template slot-scope="scope">
              {{scope.row.number | numFilter}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            width="180"
            prop="amountBonus"
            label="分红金额（元）">
            <template slot-scope="scope">
              {{scope.row.amountBonus | numFilter}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            width="180"
            prop="sumAmount"
            label="结算总额（元）">
            <template slot-scope="scope">
              {{scope.row.sumAmount | numFilter}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            width="180"
            prop="profit"
            label="收益率">
            <template slot-scope="scope">
              {{scope.row.profit}}%
            </template>
          </el-table-column>
        </el-table>
      </template>
    </div>
    <div class="part">
      <div class="title">内部员工退款明细信息</div>
      <div class="quota">
        <p>
          <span>退款金额：</span>
          <span>￥{{refundInfo.yingTui}}</span>
        </p>
        <p>
          <span>未退款金额：</span>
          <span>￥{{refundInfo.weiTui}}</span>
        </p>
        <p>
          <span>已退款金额：</span>
          <span>￥{{refundInfo.yiTui}}</span>
        </p>
      </div>
      <template>
        <el-table
          border
          :data="refundList"
          stripe
          height="250"
          style="width: 100%">
          <el-table-column
            align="center"
            type="index"
            fixed
            label="序号"
            width="80">
          </el-table-column>
          <el-table-column
            align="center"
            prop="orderNumber"
            label="订单号"
            width="220">
          </el-table-column>
          <el-table-column
            align="center"
            prop="name"
            label="员工"
            width="180">
          </el-table-column>
          <el-table-column
            align="center"
            prop="jobNumber"
            width="180"
            label="工号">
          </el-table-column>
          <el-table-column
            align="center"
            width="180"
            prop="department"
            label="部门">
          </el-table-column>
          <el-table-column
            align="center"
            width="180"
            prop="position"
            label="职位">
          </el-table-column>
          <el-table-column
            align="center"
            width="180"
            prop="number"
            label="跟投份数">
            <template slot-scope="scope">
              {{scope.row.number | numFilter}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            width="180"
            prop="quota"
            label="跟投额度（元）">
            <template slot-scope="scope">
              {{scope.row.quota | numFilter}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            width="180"
            prop="realAmount"
            label="实付金额（元）">
            <template slot-scope="scope">
              {{scope.row.realAmount | numFilter}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            width="180"
            prop="refundAmount"
            label="退费金额（元）">
            <template slot-scope="scope">
              {{scope.row.refundAmount | numFilter}}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            prop="status"
            label="退款状态">
            <template slot-scope="scope">
              {{scope.row.status ? '已退款':'未退款'}}
            </template>
          </el-table-column>
        </el-table>
      </template>
    </div>
    <div class="btn">
      <el-button type="primary" @click="saveSettlement()">保存</el-button>
      <el-button type="primary" @click="saveSettlement(1)">保存并提交审核</el-button>
      <el-button type="primary" @click="handleCancle">取消</el-button>
    </div>
  </div>
</template>

<script>
import api from '@/api/apiPath'
export default {
  name:'generatingLiquidation',
  data(){
    return {
      value:'',
      mainpartList: [],
      staffList: [],
      refundList: [],
      refundInfo:{},
      formData:{
        projectId:0,
        projectName:'',
        investTotalMoney:null,
        projecteProfitMargin:null,
        updateUserName:null,
        updateUserId:null,
      },
      // original:null,
      reGenerate:0,
      projectList:[],
      rules: {
        projecteProfitMargin:[
          {
            required: true,
            validator: (rule, value, callback) => {
              console.log(value)
              let val = Math.abs(value)
              let flatReg = /^\d+(\.\d{0,2})?$/
              if(value>=0){
                if(!flatReg.test(val)){
                  return this.$message('保留两位小数')
                }
              }
              // callback()
            }
          }
        ],
      }
    }
  },
  created(){
    this.getParams()
    if(!this.reGenerate){
      this.getSettProjectList()
    }
  },
  filters:{
    numFilter(val){
      let vall = String(val)
      return vall.replace(/\B(?=(\d{3})+(?!\d))/g,",")
    }
  },
  methods:{
    getParams(){
      this.reGenerate = this.$route.query.reGenerate
      if(this.reGenerate){
        this.formData.projectId = this.$route.query.projectId
        this.formData.projectName = this.$route.query.projectName
        this.formData.investTotalMoney = this.$route.query.projectIncome
        this.formData.projecteProfitMargin = this.$route.query.profit
        // this.original = this.$route.query.profit.toFixed(2)-0
        this.formData.updateUserName = this.$route.query.updateUserName
        this.formData.updateUserId = this.$route.query.updateUserId
      }
    },
    // 选择项目
    changeValue(val){
      if(this.projectList.findIndex(item=>item.id == val) != -1){
        this.formData.projectName = this.projectList[this.projectList.findIndex(item=>item.id == val)].projectName
        this.formData.investTotalMoney = this.projectList[this.projectList.findIndex(item=>item.id == val)].investTotalMoney
        this.formData.projecteProfitMargin = this.projectList[this.projectList.findIndex(item=>item.id == val)].projecteProfitMargin.toFixed(2)-0
        // this.original = this.projectList[this.projectList.findIndex(item=>item.id == val)].projecteProfitMargin.toFixed(2)-0
        console.log(this.projectList[this.projectList.findIndex(item=>item.id == val)].projecteProfitMargin)
      }
    }, 
    // 项目列表
    getSettProjectList(){
      this.axios.get(api.getSettProjectList).then((res)=>{
        res.data.data.forEach(item => {
          this.projectList.push(
            {
              id:item.id,
              projectName:item.projectName,
              investTotalMoney:item.investTotalMoney,
              projecteProfitMargin:item.projectedProfitMargin
            }
          )
        })
      })
    },
    // 保存并审核
    saveSettlement(val){
      let params = {}
      if(this.reGenerate){
        params.projectId = this.formData.projectId
        params.updateUserId = this.formData.updateUserId
        params.updateUserName = this.formData.updateUserName
      }else{
        params.projectId = this.value
        params.updateUserId = JSON.parse(window.sessionStorage.getItem('cmsUser')).userId
        params.updateUserName = JSON.parse(window.sessionStorage.getItem('cmsUser')).name
      }
      this.axios.post(api.delSettlementById,{
          id:this.$route.query.id
        }).then((res)=>{
          console.log(res)
          if(res.data.code == 200 ){
            this.axios.post(api.saveSettlement,{
              projectId:params.projectId,
              projectName:this.formData.projectName,
              projectIncome:this.formData.investTotalMoney,
              profit:this.formData.projecteProfitMargin,
              updateUserId:params.updateUserId,
              updateUserName:params.updateUserName,
              mainpartList:this.mainpartList,
              staffList:this.staffList,
              refundList:this.refundList,
              isfaqi:val
            }).then((res)=>{
              console.log(res)
              if(res.data.code == 200){
                if(val){
                  this.$message('保存成功并已提交审核')
                }else{
                  this.$message('保存成功')
                }
                this.$router.push('/projectLiquidationManagement')
              }
            })
          }
        })
    },
    // 取消保存
    handleCancle(){
      this.$message('已取消保存')
      this.$router.push('/projectLiquidationManagement')
    },

    // 生成
    onSubmit() {
      const b  = String(this.formData.projecteProfitMargin).indexOf('.')
      // if(this.formData.projecteProfitMargin != this.original){
      //   if(this.formData.projecteProfitMargin < 0){
      //     return this.$message('利润率不能小于0')
      //   }
      // }
      if(b != -1){
        if(this.formData.projecteProfitMargin.length > b+3){
          return this.$message('保留两位小数')
        }
      }
      let params = {}
      if(this.reGenerate){
        params.projectId = this.formData.projectId
        if(!this.formData.projectName){
          return this.$message('请填写项目名称')
        }
      }else{
        params.projectId = this.value
        if(this.value == ''){
          return this.$message('请填写项目名称')
        }
      }
      params.projectIncome = this.formData.investTotalMoney
      if(this.formData.investTotalMoney == undefined){
        return this.$message('请填写项目营收')
      }
      if(!this.formData.projecteProfitMargin){
        return this.$message('请填写项目利润率')
      }
      params.profit = this.formData.projecteProfitMargin
      // 跟投主体项目清算明细信息
      this.axios.post(api.mainpartSettlement,params).then((res)=>{
        console.log(1,res)
        this.mainpartList = []
        this.mainpartList = res.data.data.list
        const profit = this.mainpartList.findIndex(item=> item.mainpartInvest == 3)
        if(profit != -1){
          // 内部员工项目清算明细信息
          this.axios.post(api.staffSettlement,{
            projectId:params.projectId,
            projectIncome:params.projectIncome,
            mainpartInvest:this.mainpartList[profit].profit
          }).then((res)=>{
            console.log(2,res)
            this.staffList = []
            this.staffList = res.data.data.list
          })
          // 内部员工退款明细信息
          this.axios.post(api.refundSettlement,{
            projectId:params.projectId,
            mainpartInvest:this.mainpartList[profit].profit
          }).then((res)=>{
            console.log(3,res)
            this.refundList = []
            this.refundList = res.data.data.pageList.list
            this.refundInfo.weiTui = res.data.data.weiTui
            this.refundInfo.yiTui = res.data.data.yiTui
            this.refundInfo.yingTui = res.data.data.yingTui
          })
        }
      })
    },
  }
}
</script>

<style lang='stylus'>
.generatingLiquidation{
  .bread-title{
    height:30px;
    font-size:16px;
  }
  .part{
    margin-bottom :50px;
  }
  .title{
    font-size:18px;
    font-weight:700;
    margin-bottom:20px;
  }
  .el-input{
    width:450px;
  }
  .el-button{
    margin-left:200px;
  }
  .line{
    height:1px;
    background:#ccc;
    margin-bottom:50px;
  }
  .el-pagination{
    margin-top:20px;
  }
  .quota{
    display:flex;
    width:800px;
    p{
      flex:1;
    }
  }
  .btn{
    height :80px;
  }
}
</style>
